<template>
  <div class="page-list-live">
    <ListTable
      ref="RefListTable"
      style="padding: 0 20px 40px 20px;"
      :loading="tableLoading"
      :table-data="tableData"
      :table-col="tableCol"
      @selectChange="handleSelectionChange"
    >
      <template slot="col1" slot-scope="scope">
        <el-button
          :loading="scope.row.loadingDel"
          size="mini"
          icon="el-icon-delete"
          style="color: red; padding-top: 0px; padding-bottom: 0px;"
          type="text"
          @click="handleRowDel(scope.row)"
        >删除</el-button>
      </template>
    </ListTable>
  </div>
</template>
<script>
  import listMixin from '@/mixins/list'
  import { parseTime } from '@/utils/index'
  import { area, path, autoGate, baseStation } from '@/api/api'
  export default {
    mixins: [listMixin],
    data() {
      return {
        deleteList: {
          id: ''
        },
        tableData: [],
        listTitle: [
          'carId',
          'car.carType',
          'car.RFID',
          'car.plateNumber',
          'baseStation.name',
          'baseStation.area.name',
          'autoGate.area.name',
          'autoGate.name',
          'enterTime',
          'leaveTime',
          'id'
        ],
        tableCol: [
          { type: 'selection' },
          { type: 'index', label: '序号', width: '60px' },
          {
            label: '车辆类型',
            formatter(row, col, cell) {
              let deptName = ''
              if (row.carId) {
                deptName = row.car.carType
              }
              return deptName || ''
            },
            minWidth: '80px'
          },
          {
            label: 'RFID',
            formatter(row, col, cell) {
              let rfid = ''
              if (row.carId) {
                rfid = row.car.rfid
              }
              return rfid || ''
            }
          },
          {
            label: '车牌',
            formatter(row, col, cell) {
              let number = ''
              if (row.carId) {
                number = row.car.plateNumber
              }
              return number || ''
            },
            minWidth: '116px'
          },
          {
            label: '所在区域',
            formatter(row, col, cell) {
              if (row.baseStation) {
                return row.baseStation.area.name
              } else if (row.autoGate) {
                return row.autoGate.area.name
              }
            }
          },
          {
            label: '设备名称',
            formatter(row, col, cell) {
              if (row.baseStation) {
                return row.baseStation.name
              } else if (row.autoGate) {
                return row.autoGate.name
              }

            },
            minWidth: '250px'
          },
          {
            prop: 'deptCode',
            label: '进入区域时间',
            formatter(row, col, cell) {
              return row.enterTime ? parseTime(new Date(row.enterTime)) : '--'
            },
            minWidth: '150px'
          },
          {
            prop: 'enterTime',
            label: '离开区域时间',
            formatter: function (row, col, cell) {
              return row.leaveTime ? parseTime(new Date(row.leaveTime)) : '--'
            },
            minWidth: '150px'
          }
          // { label: '操作', custom: 'col1' }
        ]
      }
    },
    methods: {
      batchDeletion() {
        if (!this.deleteList.id) {
          this.$message.warning('请选择要删除的数据！')
          return
        }
        this.$_delConfirm('所选数据', () => {
          this.delRowReq(this.deleteList)
        })
      },
      // 选中事件
      handleSelectionChange(event) {
        if (event.length > 0) {
          let ary = []
          event.forEach(item => {
            ary.push(item.id)
          })
          if (ary.length > 1) {
            this.deleteList.id = ary.join(',')
          } else {
            this.deleteList.id = ary[0].toString()
          }
        } else {
          this.deleteList.id = ''
        }
        this.$emit('deleHandle', this.deleteList)
      },
      // 请求列表数据
      async getList(query) {
        this.tableLoading = true
        try {
          let obj = query || { pageIndex: 1, pageSize: 10, orderBy: 'createdTime', orderByAscent: false, search: [] }

          obj = await this.objHandler(obj)

          const {
            data: { items: resData, count, pageIndex }
          } = await path('post', obj, false)
          this.$nextTick(() => {
            this.tableData = []
            resData.forEach(item => {
              item.loadingEdit = false
              item.loadingDel = false
              // if (item.employeeId) {
              //   this.tableData.push(item)
              // }
            })
            this.tableData = JSON.parse(JSON.stringify(resData))
            this.$refs['RefListTable'].update({ page: pageIndex, count })
            this.tableLoading = false
          })
        } catch (err) {
          this.tableLoading = false
          this.tableData = []
        }
      },
      // 处理请求参数
      objHandler(obj) {
        if (!obj.search) {
          obj.search = []
        }
        // 如果选择空数据，需设置值为null
        obj.search.forEach((edit, index) => {
          if (edit.key === 'baseStation.area.name' && edit.value === '空') {
            edit.value = null
          }
        })
        if (!obj.search.some(r => r.key == 'EmployeeId')) {
          obj.search.push({
            key: 'EmployeeId',
            value: null,
            Operation: 0,
            relationship: 0,
            sequence: 0
          })
        }
        // 查询设备
        var find = obj.search.find(r => r.key == 'parntd')
        if (find) {
          // 门禁
          let existenceAutoGate = this.autoGateList.find(auto => auto.label === find.value)
          // 基站
          let existencebaseStation = this.baseStationList.find(baseStation => baseStation.label === find.value)
          // 删除
          obj.search.splice(obj.search.indexOf(find), 1)
          // 分别设置
          if (existenceAutoGate && !existencebaseStation) {
            // 门禁
            obj.search.push({
              key: 'autoGateId',
              value: existenceAutoGate.value,
              Operation: 0
            })
          } else if (!existenceAutoGate && existencebaseStation) {
            // 基站
            obj.search.push({
              key: 'baseStationId',
              value: existencebaseStation.value,
              Operation: 0
            })
          }
        }
        // 查询返回的数据
        obj.select = this.listTitle
        return obj
      },
      async delRowReq(row) {
        try {
          let obj = { id: row.id, value: null }
          await path('delete', obj, true)
          row.loadingDel = false
          this.getList()
          this.$message({
            type: 'success',
            message: '删除成功'
          })
        } catch (err) {
          row.loadingDel = false
          this.$message({
            type: 'error',
            message: '删除失败'
          })
        }
      },
      handleRowDel(row) {
        row.loadingDel = true
        this.$_delConfirm(
          '记录',
          () => {
            this.delRowReq(row)
          },
          () => {
            row.loadingDel = false
          }
        )
      }
    }
  }
</script>

<style lang="scss" scoped>
  .sc-list-filter-col {
    width: auto;
  }
</style>
